﻿<Canvas
        xmlns="http://schemas.microsoft.com/client/2007" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  	    xmlns:SilverlightControlToolkit="clr-namespace:SilverlightControlToolkit;assembly=ClientBin/SilverlightControlToolkit.dll"
        x:Name="parentCanvas" 
        Loaded="Page_Loaded" 
        Width="640"
        Height="480"
        Background="White"
        Cursor="Hand"
        >

	<Canvas.Resources>
		<Storyboard x:Name="Timeline1">
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
				<SplineDoubleKeyFrame KeyTime="00:00:01.9000000" Value="176"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
				<SplineDoubleKeyFrame KeyTime="00:00:01.9000000" Value="-160"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
				<SplineDoubleKeyFrame KeyTime="00:00:01.9000000" Value="-167.46"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
		<Storyboard x:Name="Timeline2">
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[4].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF7BA07D"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF9D7BA0"/>
				<SplineColorKeyFrame KeyTime="00:00:03" Value="#FF9D7BA0"/>
			</ColorAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF359896"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF353698"/>
				<SplineColorKeyFrame KeyTime="00:00:03" Value="#FF353698"/>
			</ColorAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF1F608A"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF1F8A5B"/>
				<SplineColorKeyFrame KeyTime="00:00:03" Value="#FF1F8A5B"/>
			</ColorAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF717639"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF763940"/>
				<SplineColorKeyFrame KeyTime="00:00:03" Value="#FF763940"/>
			</ColorAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" RepeatBehavior="Forever" Storyboard.TargetName="rect1" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[1].(SkewTransform.AngleX)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="63"/>
				<SplineDoubleKeyFrame KeyTime="00:00:03" Value="0"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
		<Storyboard x:Name="PaintPurple">
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ecp" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF8FC319"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FFC319C2"/>
			</ColorAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ecp" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF22E922"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FFE122E9"/>
			</ColorAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ecp" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF23B051"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF5623B0"/>
			</ColorAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ecp" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[5].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF0E8D77"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF6B0E8D"/>
			</ColorAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ecp" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[6].(GradientStop.Color)">
				<SplineColorKeyFrame KeyTime="00:00:00" Value="#FF095379"/>
				<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF560979"/>
			</ColorAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ecp" Storyboard.TargetProperty="(Shape.StrokeThickness)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="0"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
	</Canvas.Resources>
	
	<Rectangle x:Name="rect3" Width="112" Height="84" Fill="#FF1FC5B9" Canvas.Left="8" Canvas.Top="304"/>
	
	<SilverlightControlToolkit:EventToAction Width="1" Height="4.235" ControlsToListenName="rect1, button1" TargetsElementName="Timeline1" EventToListen="" TargetElementAction="" ActivateBegin="True" ListenToMouseEnter="False" ListenToMouseLeftButtonDown="True" RenderTransformOrigin="0.5,0.5" Canvas.Left="56" Canvas.Top="91.296" />	
	<Rectangle RenderTransformOrigin="0.5,0.45" x:Name="rect1" Width="240" Height="130.909" Stroke="#FF000000" Canvas.Left="192" Canvas.Top="141.09">
		<Rectangle.RenderTransform>
			<TransformGroup>
				<ScaleTransform ScaleX="1" ScaleY="1"/>
				<SkewTransform AngleX="0" AngleY="0"/>
				<RotateTransform Angle="0"/>
				<TranslateTransform X="0" Y="0"/>
			</TransformGroup>
		</Rectangle.RenderTransform>
		<Rectangle.Fill>
			<LinearGradientBrush EndPoint="0.957,0.127" StartPoint="0.043,0.873">
				<GradientStop Color="#FF000000" Offset="0"/>
				<GradientStop Color="#FF717639" Offset="1"/>
				<GradientStop Color="#FF359896" Offset="0.611"/>
				<GradientStop Color="#FF1F608A" Offset="0.788"/>
				<GradientStop Color="#FF7BA07D" Offset="0.298"/>
			</LinearGradientBrush>
		</Rectangle.Fill>
	</Rectangle>

	<SilverlightControlToolkit:EventToAction Width="8" Height="8.471" Canvas.Left="40" Canvas.Top="23.529" ActivateBegin="True" ActivateStop="False" ControlsToListenName="Timeline1" ListenToCompleted="True" TargetsElementName="Timeline2" RenderTransformOrigin="0.5,0.5"/>
	<SilverlightControlToolkit:DragAndDropOverlayExtender Width="100" Height="100" Canvas.Left="152" Canvas.Top="368" ElementsToMoveName="slider" AllowedAreasElementName="sliderBackground" DoNotChangeCanvasLeft="False" DoNotChangeCanvasTop="True" x:Name="slider1_extender" EnableOneClickMove="True"/>
	<Rectangle Width="272" Height="8" Canvas.Left="157.53" Canvas.Top="332" x:Name="sliderBackground" RenderTransformOrigin="0.5,0.5">
		<Rectangle.Fill>
			<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
				<GradientStop Color="#FF000000" Offset="0"/>
				<GradientStop Color="#FF302525" Offset="0.989"/>
				<GradientStop Color="#FF484848" Offset="0.285"/>
				<GradientStop Color="#FFA3A3A3" Offset="0.676"/>
				<GradientStop Color="#FF818181" Offset="0.897"/>
			</LinearGradientBrush>
		</Rectangle.Fill>
		<Rectangle.RenderTransform>
			<TransformGroup>
				<ScaleTransform ScaleX="1" ScaleY="1"/>
				<SkewTransform AngleX="0" AngleY="0"/>
				<RotateTransform Angle="0"/>
				<TranslateTransform X="0" Y="0"/>
			</TransformGroup>
		</Rectangle.RenderTransform>
	</Rectangle>
	<Rectangle x:Name="slider" Width="8" Height="32" Canvas.Left="298" Canvas.Top="318" Stroke="#FFD4FF96" RenderTransformOrigin="0.5,0.5">
		<Rectangle.Fill>
			<LinearGradientBrush EndPoint="1.941,0.593" StartPoint="-0.691,0.559">
				<GradientStop Color="#FF7CDD2B" Offset="0.176"/>
				<GradientStop Color="#FF9FEE5B" Offset="0.842"/>
				<GradientStop Color="#FFD7F8B9" Offset="0.563"/>
			</LinearGradientBrush>
		</Rectangle.Fill>
		<Rectangle.RenderTransform>
			<TransformGroup>
				<ScaleTransform ScaleX="1" ScaleY="1"/>
				<SkewTransform AngleX="0" AngleY="0"/>
				<RotateTransform Angle="0"/>
				<TranslateTransform X="0" Y="0"/>
			</TransformGroup>
		</Rectangle.RenderTransform>
	</Rectangle>
	<Rectangle Width="320" Height="76" Stroke="#FF000000" Canvas.Left="128" Canvas.Top="392" x:Name="bigArea">
		<Rectangle.Fill>
			<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
				<GradientStop Color="#FF000000" Offset="0"/>
				<GradientStop Color="#FFFFFFFF" Offset="1"/>
				<GradientStop Color="#FF484848" Offset="0.285"/>
				<GradientStop Color="#FFA3A3A3" Offset="0.676"/>
				<GradientStop Color="#FF818181" Offset="0.897"/>
			</LinearGradientBrush>
		</Rectangle.Fill>
	</Rectangle>
	<Ellipse x:Name="ecp" Width="40" Height="24" Canvas.Left="280" Canvas.Top="424" Stroke="#FF000000">
		<Ellipse.Fill>
			<RadialGradientBrush>
				<GradientStop Color="#FF8FC319" Offset="0"/>
				<GradientStop Color="#FFFFFFFF" Offset="1"/>
				<GradientStop Color="#FF22E922" Offset="0.285"/>
				<GradientStop Color="#FF23B051" Offset="0.676"/>
				<GradientStop Color="#FF818181" Offset="0.897"/>
				<GradientStop Color="#FF0E8D77" Offset="0.889"/>
				<GradientStop Color="#FF095379" Offset="0.993"/>
			</RadialGradientBrush>
		</Ellipse.Fill>
	</Ellipse>
	<SilverlightControlToolkit:DragAndDropOverlayExtender Width="16" Height="0" Canvas.Left="8" Canvas.Top="392" AllowedAreasElementName="bigArea, rect3" DraggingOpacity="0.8" ElementsToMoveName="ecp" EnableOneClickMove="True" x:Name="drag_multi"/>
	<Rectangle Width="4" Height="172.265" Stroke="#FF000000" Canvas.Left="576" Canvas.Top="259.735" x:Name="sliderBackground_Copy" RenderTransformOrigin="0.5,0.5">
		<Rectangle.Fill>
			<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
				<GradientStop Color="#FF000000" Offset="0"/>
				<GradientStop Color="#FFFFFFFF" Offset="1"/>
				<GradientStop Color="#FF484848" Offset="0.285"/>
				<GradientStop Color="#FFA3A3A3" Offset="0.676"/>
				<GradientStop Color="#FF818181" Offset="0.897"/>
			</LinearGradientBrush>
		</Rectangle.Fill>
		<Rectangle.RenderTransform>
			<TransformGroup>
				<ScaleTransform ScaleX="1" ScaleY="1"/>
				<SkewTransform AngleX="0" AngleY="0"/>
				<RotateTransform Angle="0"/>
				<TranslateTransform X="0" Y="0"/>
			</TransformGroup>
		</Rectangle.RenderTransform>
	</Rectangle>
	<Rectangle x:Name="slider_Copy" Width="46.456" Height="8" Canvas.Left="552" Canvas.Top="336" Stroke="#FFD4FF96" RenderTransformOrigin="0.5,0.5">
		<Rectangle.Fill>
			<LinearGradientBrush EndPoint="1.941,0.593" StartPoint="-0.691,0.559">
				<GradientStop Color="#FF7CDD2B" Offset="0.176"/>
				<GradientStop Color="#FF9FEE5B" Offset="0.842"/>
				<GradientStop Color="#FFD7F8B9" Offset="0.563"/>
			</LinearGradientBrush>
		</Rectangle.Fill>
		<Rectangle.RenderTransform>
			<TransformGroup>
				<ScaleTransform ScaleX="1" ScaleY="1"/>
				<SkewTransform AngleX="0" AngleY="0"/>
				<RotateTransform Angle="0"/>
				<TranslateTransform X="0" Y="0"/>
			</TransformGroup>
		</Rectangle.RenderTransform>
	</Rectangle>
	<SilverlightControlToolkit:DragAndDropOverlayExtender Width="100" Height="100" Canvas.Left="152" Canvas.Top="368" ElementsToMoveName="slider_Copy" AllowedAreasElementName="sliderBackground_Copy" DoNotChangeCanvasLeft="True" DoNotChangeCanvasTop="False" x:Name="slider2_extender"/>
	<Path x:Name="oddShape" Width="47" Height="96" Stretch="Fill" Stroke="#FF000000" Canvas.Left="82.5" Canvas.Top="164.5" Data="M121,179 C126.11683,226.07488 121.98741,221.01259 83,260 83,231.62353 85,203.04615 85,175 99.135428,175 114.69765,165 129,165 123.85443,165.85759 122,163.84813 122,173 124,173 126,173 128,173 126.493,177.52099 126.94257,177.52872 122,180 121.66667,179.66667 121.33333,179.33333 121,179 z">
		<Path.Fill>
			<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
				<GradientStop Color="#FF000000" Offset="0"/>
				<GradientStop Color="#FFFFFFFF" Offset="1"/>
				<GradientStop Color="#FF484848" Offset="0.285"/>
				<GradientStop Color="#FFA3A3A3" Offset="0.676"/>
				<GradientStop Color="#FF818181" Offset="0.897"/>
			</LinearGradientBrush>
		</Path.Fill>
	</Path>
	<SilverlightControlToolkit:DragAndDropOverlayExtender x:Name="drag_anywhere" Width="0" Height="11.5" Canvas.Left="24" Canvas.Top="164.5" DraggingOpacity="0.8" ElementsToMoveName="oddShape"/>
	<SilverlightControlToolkit:EventToAction x:Name="CliccOnEclipsePaintPurple" Width="8" Height="4" Canvas.Left="24" Canvas.Top="464" ActivateBegin="True" ControlsToListenName="ecp" ListenToMouseLeftButtonDown="True" TargetsElementName="PaintPurple"/>
	<Ellipse x:Name="circ" Width="33" Height="18" Fill="#FF3A3A3A" Stroke="#FF000000" Canvas.Left="24" Canvas.Top="318"/>
	<SilverlightControlToolkit:DragAndDropOverlayExtender x:Name="oneAreaMove" Width="32" Height="16" Canvas.Left="120" Canvas.Top="112" AllowedAreasElementName="rect3" ElementsToMoveName="circ" EnableOneClickMove="False" Disabled="False"/>
	<Ellipse x:Name="button1" Width="56" Height="31.999" Stroke="#FFD4FF96" Canvas.Left="464" Canvas.Top="240">
		<Ellipse.Fill>
			<LinearGradientBrush EndPoint="1.941,0.593" StartPoint="-0.691,0.559">
				<GradientStop Color="#FF7CDD2B" Offset="0.176"/>
				<GradientStop Color="#FF9FEE5B" Offset="0.842"/>
				<GradientStop Color="#FFD7F8B9" Offset="0.563"/>
			</LinearGradientBrush>
		</Ellipse.Fill>
	</Ellipse>
</Canvas>